<template>
  <li class="pt30 pb30 bb90 clearfix" @click="gotoDetail(myTravel['id'])">
    <img class="fl br2 w310 h200 mr20" :src="myTravel['coverImgUrl']+'?x-oss-process=image/resize,m_fill,h_200,w_310'" width="310" height="200" alt="" />
    <dl class="fl w550 h200">
      <dt class="c0 lh30 f20 clearfix">{{myTravel['activityName']}}
        <span class="fr f12 c60 lh150" v-if="myTravel['activityPlaceList'].length>0">
          <i class="inline-block w10 h14 locationBg vm mr5"></i>{{myTravel['activityPlaceList'][0]['placeName']}}
        </span>
      </dt>
      <dd class="lh38 mt20">
        <img :src="myTravel['userImgUrl']" width="38" height="38" style="border-radius:19px"/>
        <span class="ml15 mr20">{{myTravel['nickName']}}</span>
        <span>发表于：{{myTravel['addTime']}}</span>
      </dd>
      <dd class=" mt18 h60 overflow ">{{limitWord(myTravel['activityDescripition'],40,'...')}}</dd>
      <dd class="c60 f12 fm lh150 mt10">
        <!--<span class="vm mr30"><em class="mr10">阅读</em><i class="c_orgRed_ff481d">3000</i></span>-->
        <span class="inline-block vm mr30"><em class="inline-block w15 h14 commentsBg vm mr10"></em><i class="c_orgRed_ff481d vm">{{myTravel['commentCount']}}</i></span>
        <span class="inline-block vm"><em class="inline-block w17 h14 favoriteBg vm mr10"></em><i class="c_orgRed_ff481d vm">{{myTravel['praiseCount']}}</i></span>
      </dd>
    </dl>
  </li>
</template>

<script>
  import Utils from '../assets/Util';
    export default {
        name: "travelItem",
        props:{
          travel:Object
        },
        data(){
          return {
            myTravel:this.travel
          }
        },
        methods:{
          limitWord(words, wordsLength, mark){
              return Utils.limitworld(words, wordsLength, mark);
          },
          gotoDetail(id){
            this.$router.push({
              path: '/travelDetail',
              query: {
                id: id
              }
            })
          }
        }
    }
</script>

<style scoped>

</style>
